<template>
	<div class="orderList">
		<div style="display: flex;justify-content: space-between;">
			<div>
				<el-button size="mini" v-if="userInfo.roleId < 4" type="primary" 
					@click="addOrder">
					下单
				</el-button>
				<el-button size="mini" v-if="userInfo.roleId === 3" type="primary" 
					@click="leaderboard">
					排行榜
				</el-button>
				<el-button size="mini" v-if="userInfo.roleId === 1" type="primary" 
					@click="getRemindDays">
					提醒天数
				</el-button>
			</div>
			<div style="display: flex;">
				<el-input v-model="sn" placeholder="按流水号" @change="getOrderList"
					style="width: 120px;" clearable size="mini">
				</el-input>
				<el-input v-model="name" placeholder="按客户" @change="getOrderList" 
					style="width: 100px;" clearable size="mini">
				</el-input>
				<el-select v-model="userId" filterable remote :loading="userLoading" 
					placeholder="按业务员" size="mini"
					:remote-method="getUserList" v-if="userInfo.roleId < 3"
					@focus="getUserList('')" @change="selectUserChange"
					style="width: 100px;">
					<el-option v-for="item in userList" :key="item.id" :label="item.nickName" 
						:value="item.id">
					</el-option>
				</el-select>
				<el-select v-model="status" placeholder="订单状态" @change="selectStatusChange"
					style="width: 100px;" size="mini">
					<el-option label="未收款" :value="0"></el-option>
					<el-option label="已收款" :value="1"></el-option>
					<el-option label="已欠款" :value="2"></el-option>
				</el-select>
				<el-button size="mini" @click="rest" v-debounce>
					重置
				</el-button>
			</div>
		</div>
		<div class="order-table">
			<el-table :data="tableData" v-loading="loading" border style="width: 100%" height="100%"
				:row-style="tableRow">
				<el-table-column prop="i" label="序号" fixed="left" width="50"></el-table-column>
				<!-- <el-table-column prop="sn" label="订单流水号" width="150"></el-table-column> -->
				<el-table-column label="订单类型" width="80">
					<template slot-scope="scope">
						<span v-if="scope.row.orderType === 1">开销开单</span>
						<span v-else>签订合同</span>
					</template>
				</el-table-column>
				<el-table-column label="客户姓名" width="80" v-if="userInfo.roleId !== 6">
					<template slot-scope="scope">
						<el-popover trigger="hover" placement="top">
							<p>客户姓名：{{scope.row.name}}</p>
							<p>公司名称：{{scope.row.company}}</p>
							<span slot="reference">{{scope.row.name}}</span>
						</el-popover>
					</template>
				</el-table-column>
				<el-table-column prop="phone" label="联系电话" width="115" 
					v-if="userInfo.roleId !== 6">
				</el-table-column>
				<el-table-column prop="nickName" label="业务员" width="80">
				</el-table-column>
				<el-table-column prop="deliveryTime" label="交货时间" width="100"
					v-if="userInfo.roleId !== 6">
				</el-table-column>
				<el-table-column label="产品列表" width="80" v-if="userInfo.roleId !== 6">
					<template slot-scope="scope">
						<el-button type="text" @click="partsOpen(scope.row)">点击查看</el-button>
					</template>
				</el-table-column>
				<el-table-column label="总金额(元)" width="125">
					<template slot-scope="scope">
						<el-popover v-if="scope.row.orderType === 2" trigger="hover" placement="top">
							<p>总金额：{{scope.row.transactionAmount}}</p>
							<p>定金：{{scope.row.deposit}}</p>
							<p>首付款：{{scope.row.downPayment}}</p>
							<p>尾款：{{scope.row.balancePayment}}</p>
							<span slot="reference">{{`${scope.row.transactionAmount}(${scope.row.arrears})`}}</span>
						</el-popover>
						<span v-else>{{`${scope.row.transactionAmount}(${scope.row.arrears})`}}</span>
					</template>
				</el-table-column>
				<el-table-column label="付款方式" width="80">
					<template slot-scope="scope">
						<el-popover v-if="scope.row.paymentMethod > 0" trigger="hover" placement="top">
							<p>总分期数：{{scope.row.paymentMethod}} 期</p>
							<p>剩余期数：{{scope.row.residuePeriods}} 期</p>
							<p>每期应还：{{scope.row.phaseAmount}}</p>
							<p>末期应还：{{scope.row.lastAmount}}</p>
							<p>每月还款日：{{scope.row.repaymentDate}} 号</p>
							<span slot="reference">分期</span>
						</el-popover>
						<span v-else>全款</span>
					</template>
				</el-table-column>
				<el-table-column label="付款类型" width="80">
					<template slot-scope="scope">
						<span v-if="scope.row.paymentType ===0">先发后付</span>
						<span v-else>先付后发</span>
					</template>
				</el-table-column>
				<el-table-column label="身份证复印件" width="110" v-if="userInfo.roleId !== 6">
					<template slot-scope="scope">
						<div v-if="scope.row.copyOfIdCard !== null"
							style="width: 100%; white-space: nowrap; overflow: hidden;">
							<el-image :src="scope.row.copyOfIdCardList[0]"
								:preview-src-list="scope.row.copyOfIdCardList"
								style="width: 80px; height: 80px; margin-left: 5px;">
							</el-image>
						</div>
						<div v-else>
							<span>暂无图片</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column label="验收单" width="110" v-if="userInfo.roleId !== 6">
					<template slot-scope="scope">
						<div v-if="scope.row.receipt !== null"
							style="width: 100%; white-space: nowrap; overflow: hidden;">
							<el-image :src="scope.row.receiptList[0]" 
								:preview-src-list="scope.row.receiptList"
								style="width: 80px; height: 80px; margin-left: 5px;">
							</el-image>
						</div>
						<div v-else>
							<span>暂无图片</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column label="物流信息" width="110" v-if="userInfo.roleId !== 6">
					<template slot-scope="scope">
						<div v-if="scope.row.logisticsInformation !== null"
							style="width: 100%; white-space: nowrap; overflow: hidden;">
							<el-image :src="scope.row.logisticsInformationList[0]"
								:preview-src-list="scope.row.logisticsInformationList"
								style="width: 80px; height: 80px; margin-left: 5px;">
							</el-image>
						</div>
						<div v-else>
							<span>暂无图片</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column label="签订合同" width="110" v-if="userInfo.roleId !== 6">
					<template slot-scope="scope">
						<div v-if="scope.row.contract !== null"
							style="width: 100%; white-space: nowrap; overflow: hidden;">
							<el-image :src="scope.row.contractList[0]" 
								:preview-src-list="scope.row.contractList"
								style="width: 80px; height: 80px; margin-left: 5px;">
							</el-image>
						</div>
						<div v-else>
							<span>暂无图片</span>
						</div>
					</template>
				</el-table-column>
				<el-table-column label="订单状态" fit>
					<template slot-scope="scope">
						<span v-if="scope.row.status ===0">未收款</span>
						<span v-else-if="scope.row.status ===1">已收款</span>
						<span v-else>已欠款</span>
					</template>
				</el-table-column>
				<el-table-column prop="createTime" label="下单时间" width="110">
				</el-table-column>
				<el-table-column prop="remark" label="备注" width="180">
				</el-table-column>
				<el-table-column label="操作" width="140" fixed="right">
					<template slot-scope="scope">
						<div style="display: flex">
							<el-button size="mini" @click="examine(scope.row)" 
								v-if="examineButtonShow(scope.row)"
								type="text"
								:disabled="orderButtonDisabled(scope.row.orderFlowId)">
								{{orderButtonText(scope.row.orderFlowId)}}
							</el-button>
							<el-button size="mini" @click="applicationOpen(scope.row)"
								v-if="paymentButtonShow(scope.row)" 
								type="text"
								:disabled="paymentButtonDisabled(scope.row.paymentFlowId)">
								{{paymentButtonText(scope.row.paymentFlowId)}}
							</el-button>
							<el-button size="mini" @click="details(scope.row)" type="text"
								v-if="userInfo.roleId !== 6">
								详情
							</el-button>
							<el-button size="mini" type="text"
								@click="deleteOrder(scope.row)" v-if="userInfo.roleId === 1">
								删除
							</el-button>
						</div>
					</template>
				</el-table-column>
			</el-table>
			<el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange"
				:current-page="currentPage" :page-sizes="[20, 50, 100]" :page-size="pageSize"
				layout="total, sizes, prev, pager, next, jumper" :total="total">
			</el-pagination>
		</div>
		<!-- 提醒天数弹窗 -->
		<el-dialog style="margin-top:0" :visible.sync="remindShow" width="30%" title="提醒天数">
			<h4>设置到期还款提前提醒天数</h4>
			<el-input v-model="remindDays" placeholder="提醒天数" type="number" 
				@input="inputCheck">
			</el-input>
			<div slot="footer">
				<el-button @click="remindShow = false">取消</el-button>
				<el-button type="primary" @click="updateReminderDays" v-debounce>
					确定
				</el-button>
			</div>
		</el-dialog>
		<!-- 查看产品列表弹窗 -->
		<el-dialog style="margin-top:0" :visible.sync="partsShow" width="75%" 
			:title="selectTitle" @close="partsClose">
			<div class="data-table">
				<el-table :data="selectData.goodsList" border stripe style="width: 100%" :max-height="500">
					<el-table-column prop="i" fixed="left" label="序号" width="50">
					</el-table-column>
					<el-table-column label="图片" width="115">
						<template slot-scope="scope">
							<el-image :src="READ_IMG_URL+scope.row.image" 
								style="width: 90px; height: 90px;"
								:preview-src-list="new Array(READ_IMG_URL+scope.row.image)">
							</el-image>
						</template>
					</el-table-column>
					<el-table-column prop="isProduct" label="产品类型" width="80">
						<template slot-scope="scope">
							<el-tag v-if="scope.row.isProduct == 0">成品</el-tag>
							<el-tag type="warning" v-if="scope.row.isProduct == 1">零件</el-tag>
						</template>
					</el-table-column>
					<el-table-column prop="partName" label="零件名称" fit>
					</el-table-column>
					<el-table-column prop="model" label="零件型号" fit>
					</el-table-column>
					<el-table-column prop="devicesDescribe" label="产品描述" fit>
					</el-table-column>
					<el-table-column prop="remark" label="备注" fit>
					</el-table-column>
					<el-table-column prop="price" label="销售单价" width="80">
					</el-table-column>
					<el-table-column prop="goodsCount" label="卖出数量" width="80">
					</el-table-column>
					<el-table-column prop="totalAmount" label="总计" width="80">
					</el-table-column>
				</el-table>
			</div>
		</el-dialog>
		<!-- 订单审核 -->
		<el-dialog style="margin-top:0" :visible.sync="orderShow" width="75%" title="下单审核" @close="orderCloseDialog">
			<el-form inline label-position="top">
				<el-form-item label="订单类型">
					<el-select :value="selectData.orderType" style="width: 100%;" disabled>
						<el-option label="开销开单" :value="1"></el-option>
						<el-option label="签订合同" :value="2"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item label="下单客户">
					<el-input :value="selectData.name" readonly></el-input>
				</el-form-item>
				<el-form-item label="联系电话">
					<el-input :value="selectData.phone" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="公司名称">
					<el-input :value="selectData.company" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="交货地址">
					<el-input :value="selectData.address" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="交货时间" prop="deliveryTime">
					<el-date-picker :value="selectData.deliveryTime" type="date" style="width: 100%;" readonly>
					</el-date-picker>
				</el-form-item>
				<el-form-item label="总金额">
					<el-input :value="selectData.transactionAmount" readonly>
					</el-input>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2" label="定金">
					<el-input :value="selectData.deposit" readonly>
					</el-input>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2" label="首付款">
					<el-input :value="selectData.downPayment" readonly>
					</el-input>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2" label="尾款">
					<el-input :value="selectData.balancePayment" readonly>
					</el-input>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2" label="付款方式">
					<el-input v-if="selectData.paymentMethod > 0" readonly :value="`分 ${selectData.paymentMethod} 期`">
					</el-input>
					<el-input v-else value="全款" readonly></el-input>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2 
					&& selectData.paymentMethod > 0" label="每期应还">
					<el-input :value="selectData.phaseAmount" readonly>
					</el-input>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2 
					&& selectData.paymentMethod > 0" label="末期应还">
					<el-input v-model="selectData.lastAmount" readonly>
					</el-input>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2 
					&& selectData.paymentMethod > 0" label="每月还款日">
					<el-input :value="`${selectData.repaymentDate} 号`" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="付款类型">
					<el-select v-model="selectData.paymentType" disabled>
						<el-option label="先发后付" :value="0"></el-option>
						<el-option label="先付后发" :value="1"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2" label="客户身份证号">
					<el-input v-model="selectData.clientsIdCard" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="产品列表" style="width: 100%;">
					<div class="data-table">
						<el-table :data="selectData.goodsList" border stripe style="width: 100%" :max-height="500">
							<el-table-column prop="i" fixed="left" label="序号" width="60">
							</el-table-column>
							<el-table-column label="图片" width="120">
								<template slot-scope="scope">
										<el-image :src="READ_IMG_URL+scope.row.image" style="width: 90px; height: 90px;"
										:preview-src-list="new Array(READ_IMG_URL+scope.row.image)">
										</el-image>
								</template>
							</el-table-column>
							<el-table-column prop="partName" label="零件名称" fit>
							</el-table-column>
							<el-table-column prop="model" label="零件型号" fit>
							</el-table-column>
							<el-table-column prop="price" label="销售单价" width="100">
							</el-table-column>
							<el-table-column prop="goodsCount" label="卖出数量" width="100">
							</el-table-column>
							<el-table-column prop="totalAmount" label="总计" width="100">
							</el-table-column>
						</el-table>
					</div>
				</el-form-item>
				<div>
					<el-button type="success" @click="orderExamine(1)" v-debounce>
						通过
					</el-button>
					<el-button type="danger" @click="orderExamine(2)" v-debounce>
						驳回
					</el-button>
					<el-button @click="orderCloseDialog">取消</el-button>
				</div>
			</el-form>
		</el-dialog>
		<!-- 收款审核 -->
		<el-dialog style="margin-top:0" :visible.sync="applicationShow" width="75%" title="收款审核"
			@close="applicationCloseDialog">
			<el-form inline label-position="top">
				<el-form-item label="订单流水号">
					<el-input :value="selectData.sn" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="订单类型">
					<el-select :value="selectData.orderType" style="width: 100%;" disabled>
						<el-option label="开销开单" :value="1"></el-option>
						<el-option label="签订合同" :value="2"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2 && selectData.paymentMethod > 0" label="总期数">
					<el-input :value="billing.totalPeriod" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="总金额">
					<el-input :value="selectData.transactionAmount" readonly>
					</el-input>
				</el-form-item>
				<el-form-item v-if="selectData.orderType === 2" label="本期">
					<el-input v-if="billing.currentPeriod === -1" value="定金" readonly>
					</el-input>
					<el-input v-else-if="billing.currentPeriod === 0" value="首付款" readonly>
					</el-input>
					<el-input v-else :value="billing.currentPeriod" readonly>
					</el-input>
				</el-form-item>
				</el-form-item>
				<el-form-item label="收款金额">
					<el-input :value="billing.amount" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="收款日期">
					<el-input :value="billing.repaymentDate" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="实收金额">
					<el-input :value="billing.fundsReceived" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="实收日期">
					<el-input :value="billing.dateReceived" readonly>
					</el-input>
				</el-form-item>
				<el-form-item label="收款账户">
					<el-input :value="billing.account" readonly>
					</el-input>
				</el-form-item>
				<div>
					<el-button type="success" @click="orderPayment(1)" 
						v-if="selectData.paymentFlowId == '0'" v-debounce>
						通过
					</el-button>
					<el-button type="danger" @click="orderPayment(2)" 
						v-if="selectData.paymentFlowId == '0'" v-debounce>
						驳回
					</el-button>
					<el-button @click="applicationCloseDialog">
						取消
					</el-button>
				</div>
			</el-form>
		</el-dialog>
		<!-- 排行榜 -->
		<el-dialog style="margin-top:0" :visible.sync="leaderboardShow" width="60%" 
			title="排行榜">
			<div style="display: flex;justify-content: space-between;">
				<div>
					<div>
						<label class="leaderboardLabel">
							{{`我的排名：${selectLeaderboard.ranking}`}}
						</label>
						<label class="leaderboardLabel">
							{{`提成点：${selectLeaderboard.percentage}`}}
						</label>
						<label class="leaderboardLabel">
							{{`订单数：${selectLeaderboard.total}`}}
						</label>
					</div>
					<div>
						<label class="leaderboardLabel">
							{{`销售金额：${selectLeaderboard.salesAmount}`}}
						</label>
						<label class="leaderboardLabel">
							{{`回款金额：${selectLeaderboard.collectionAmount}`}}
						</label>
						<label class="leaderboardLabel">
							{{`发放金额：${selectLeaderboard.totalAmount}`}}
						</label>
					</div>
				</div>
				<div>
					<el-date-picker v-model="selectDate" :type="dateType" :clearable="false"
						placeholder="选择日期" @change="changeDate" style="width: 130px;">
					</el-date-picker>
					<el-select v-model="dateType" style="width: 70px;" @change="changeType">
						<el-option value="year" label="年"></el-option>
						<el-option value="month" label="月"></el-option>
					</el-select>
				</div>
			</div>
			<el-table :data="leaderboardData" v-loading="leaderboardLoading" border stripe
				style="width: 100%;margin-top: 10px;" :height="400">
				<el-table-column prop="ranking" label="排名" fit></el-table-column>
				<el-table-column prop="nickName" label="姓名" fit></el-table-column>
				<el-table-column prop="total" label="订单数" fit></el-table-column>
			</el-table>
			
		</el-dialog>
	</div>
</template>

<script>
  import config from '../../api/apiURL.js';
	import orderApi from '../../api/order.js';
	import userApi from '../../api/user.js';
	export default {
		data() {
			return {
        READ_IMG_URL: config.READ_IMG_URL,
				remindShow: false,
				remindDays: null,
				userLoading: false,
				userInfo: {},
				tableData: [],
				loading: false,
				currentPage: 1,
				pageSize: 50,
				total: 0,
				orderShow: false,
				applicationShow: false,
				selectData: {},
				selectTitle: "",
				partsShow: false,
				billing: {},
				sn: null,
				name:null,
				status: null,
				nickName: null,
				userId: null,
				userList: [],
				leaderboardShow: false,
				leaderboardLoading: false,
				leaderboardData: [],
				selectLeaderboard: {
					ranking: 0,
					percentage: 0.0,
					total: 0,
					salesAmount: 0.0,
					collectionAmount: 0.0,
					totalAmount: 0.0
				},
				selectDate: null,
				year: null,
				yearMonth: null,
				dateType: 'month',
			}
		},
		created() {
			this.getOrderList();
			this.initDate();
			this.userInfo = JSON.parse(localStorage.getItem("userInfo"))
			this.userInfo.roleId = parseInt(this.userInfo.roleId)
		},
		destroyed() {
			// 组件销毁时，从本地存储移除orderId
			localStorage.removeItem("orderId");
		},
		methods: {
			getOrderList() {
				this.loading = true;
				const data = {
					sn: this.sn,
					name: this.name,
					status: this.status,
					userId: this.userId,
					currentPage: this.currentPage,
					pageSize: this.pageSize,
				}
				orderApi.getOrderList(data).then(res => {
					if (res.code === 200) {
						//console.log("res==>",res.data);
						this.tableData = res.data.orderVoList.map((item, index) => {
							item.i = (this.currentPage - 1) * this.pageSize + index + 1;
              if(item.copyOfIdCardList !== null){
                let list = []
                item.copyOfIdCardList.forEach(img =>{
                  list.push(config.READ_IMG_URL+img);
                })
                item.copyOfIdCardList = list;
              }
              if(item.logisticsInformationList !== null){
                let list = []
                item.logisticsInformationList.forEach(img =>{
                  list.push(config.READ_IMG_URL+img);
                })
                item.logisticsInformationList = list;
              }
              if(item.receiptList !== null){
                let list = []
                item.receiptList.forEach(img =>{
                  list.push(config.READ_IMG_URL+img);
                })
                item.receiptList = list;
              }
              if(item.contractList !== null){
                let list = []
                item.contractList.forEach(img =>{
                  list.push(config.READ_IMG_URL+img);
                })
                item.contractList = list;
              }

              return item;
						})
						this.total = res.data.total
						this.loading = false;
					}
				})
			},
			// pageSize变化
			handleSizeChange(pageSize) {
				this.pageSize = pageSize
				this.getOrderList()
			},
			// 页码变化
			handleCurrentChange(curPage) {
				this.currentPage = curPage
				this.getOrderList()
			},
			// 展示零件列表
			partsOpen(row){
				row.goodsList.forEach((part,index) =>{
					part.i = index +1
				})
				this.selectData = row;
				this.selectTitle = row.name;
				this.partsShow = true;
			},
			// 关闭零件列表
			partsClose(){
				this.selectData = {}
				this.selectTitle = ""
			},
			// 下单审核按钮是否显示
			examineButtonShow(item) {
				if (item.orderFlowId === "1" && item.paymentFlowId !== null) {
					return false;
				}
				return true;
			},
			// 下单审核按钮文字
			orderButtonText(orderFlowId) {
				//console.log('orderFlowId=>', orderFlowId)
				if (orderFlowId === "1") {
					return '订单通过';
				} else if (orderFlowId === "2") {
					return '订单驳回';
				}
				return '订单审核';
			},
			// 下单审核按钮类型
			orderButtonType(orderFlowId) {
				//console.log("orderFlowId=>",orderFlowId)
				if (orderFlowId === "1") {
					return 'success'
				} else if (orderFlowId === "2") {
					return 'danger'
				}
				return 'warning'
			},
			// 下单审核按钮是否禁用
			orderButtonDisabled(orderFlowId) {
				if (this.userInfo.roleId < 3 && orderFlowId === '0') {
					return false;
				}
				return true;
			},

			// 收款申请按钮
			applicationButton(item) {
				if (this.userInfo.roleId < 4 && item.orderFlowId === '1' &&
					item.paymentFlowId === null) {
					return true
				}
				return false
			},

			// 获取订单账单
			getOrderBillingList(orderId) {
				const data = {
					orderId: orderId,
					billStatus: 3
				}
				orderApi.getOrderBillingList(data).then(res => {
					if (res.code === 200) {
						//console.log("列表=>",res.data)
						if (res.data.length > 0) {
							this.billing = res.data[0];
						}
					}
				})
			},

			// 收款审核按钮是否显示
			paymentButtonShow(item) {
				if (item.orderFlowId === "1" && item.paymentFlowId !== null) {
					return true;
				}
				return false;
			},

			// 收款审核类型
			paymentButtonType(paymentFlowId) {
				if (paymentFlowId === "1") {
					return 'success'
				} else if (paymentFlowId === "2") {
					return 'danger'
				}
				return 'warning'
			},
			// 收款审核按钮是否禁用
			paymentButtonDisabled(paymentFlowId) {
				if (this.userInfo.roleId < 3 || this.userInfo.roleId === 6) {
					if (paymentFlowId === '0') {
						return false;
					}
				}
				return true;
			},
			// 收款审核按钮文字
			paymentButtonText(paymentFlowId) {
				if (paymentFlowId === "1") {
					return '收款通过';
				} else if (paymentFlowId === "2") {
					return '收款驳回';
				}
				return '收款审核';
			},
			// 行颜色
			tableRow({
				row
			}) {
				//console.log("row==>", row)
				if (row.status === 1) {
					return {
						// background: '#f0f9eb'
						background: '#cfffd7'
					};
				} else if (row.status === 2) {
					return {
						// background: '#fef0f0'
						background: '#ffe1e1'
					};
				}
				return {
					// background: 'oldlace'
					background: '#ffdebd'
				};
			},
			// 订单详情
			details(item) {
				//console.log("item=>",item);
				localStorage.setItem("orderId", item.id);
				this.$router.push({
					path: "/order/order"
				})
			},
			// 下单按钮
			addOrder() {
				this.$router.push({
					path: "/order/order"
				})
			},
			// 下单审核按钮
			examine(item) {
				console.log(item)
				this.selectData = item;
				this.selectData.goodsList = item.goodsList.map((item,index) =>{
					item.i = index+1
					return item;
				})
				this.orderShow = true;
			},
			// 下单审核弹窗关闭
			orderCloseDialog() {
				this.selectData = {};
				this.orderShow = false;
			},
			// 订单审核
			orderExamine(type) {
				let msg = ''
				if (type === 1) {
					msg = '是否要通过订单？'
				} else if (type === 2) {
					msg = '是否要驳回订单？'
				}
				this.$confirm(msg, '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					const data = {
						id: this.selectData.id,
						orderApprovalFlowId: type
					}
					orderApi.orderExamine(data).then(res => {
						if (res.code === 200) {
							this.$message.success("操作成功")
							this.orderCloseDialog();
							this.getOrderList();
						}
					})
				}).catch(() => {});
			},
			// 打开收款审核弹窗
			applicationOpen(item) {
				this.selectData = item;
				this.getOrderBillingList(item.id);
				this.applicationShow = true;
			},
			// 关闭收款审核
			applicationCloseDialog() {
				this.selectData = {};
				this.billing = {};
				this.applicationShow = false;
			},
			// 收款审核确定按钮
			orderPayment(type) {
				let msg = ''
				if (type === 1) {
					msg = '是否要通过收款申请？'
				} else if (type === 2) {
					msg = '是否要驳回收款申请？'
				}
				let _this = this
				this.$confirm(msg, '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					const data = {
						id: _this.selectData.id,
						orderBillingId: _this.billing.id,
						paymentApprovalFlowId: type
					}
					orderApi.collectionAudit(data).then(res => {
						if (res.code === 200) {
							_this.$message.success("操作成功")
							_this.applicationCloseDialog();
							_this.getOrderList();
						}
					})
				}).catch(() => {});
			},
			// 远程搜索业务员
			getUserList(query) {
				this.userLoading = true;
				const data = {
					nickName: query,
					roleId: 3,
				}
				userApi.fuzzyQuery(data).then(res => {
					if (res.code === 200) {
						this.userList = res.data.userVoList;
						this.userLoading = false;
					}
				})
			},
			// 根据业务员查询
			selectUserChange(e) {
				this.userId = e
				this.currentPage = 1
				this.pageSize = 50
				this.getOrderList()
			},
			// 根据状态查询
			selectStatusChange(e) {
				this.status = e
				this.currentPage = 1
				this.pageSize = 50
				this.getOrderList();
			},
			// 重置查询条件
			rest() {
				this.sn = null
				this.status = null
				this.userId = null
				this.currentPage = 1
				this.pageSize = 50
				this.getOrderList();
			},
			// 删除
			deleteOrder(row){
				this.$confirm("是否要删除该订单？","提示",{
					confirmButtonText: "确定",
					cancelButtonText: "取消",
					type: "warning"
				}).then(() =>{
					const loading = this.$loading({
						lock: true,
						text: 'Loading',
						spinner: 'el-icon-loading',
						background: 'rgba(0, 0, 0, 0.7)'
					});
					orderApi.deleteOrder(row).then(res =>{
						if (res.code === 200){
							this.$message.success("删除成功")
							this.getOrderList();
						}
					}).finally(() =>{
						loading.close();
					})
				}).catch(() =>{
					
				});
			},
			initDate(){
				const currentYear = new Date().getFullYear();
				let currentMonth = new Date().getMonth() + 1;
				if (currentMonth < 10) {
					currentMonth = '0' + currentMonth;
				}
				this.selectDate = `${currentYear}-${currentMonth}`;
				this.yearMonth = this.selectDate;
			},
			// 排行榜
			leaderboard(){
				this.leaderboardShow = true;
				this.leaderboardLoading = true;
				const data = {
					roleId: 3,
					year: this.year,
					yearMonth: this.yearMonth,
				}
				orderApi.orderRoyalty(data).then(res => {
					if (res.code === 200) {
						this.leaderboardData = res.data.map(item =>{
							if (item.userId === this.userInfo.id){
								this.selectLeaderboard = item
							}
							return item;
						});
					}
				}).finally(() =>{
					this.leaderboardLoading = false;
				})
			},
			changeDate(){
				//console.log("选择的日期==>",this.selectDate)
				this.year = null;
				this.yearMonth = null;
				if (this.selectDate !== null) {
					const year = this.selectDate.getFullYear();
					const month = this.selectDate.getMonth() + 1; // 月份从 0 开始，需要加 1
					// 格式化月份，确保始终是两位数
					const formattedMonth = month < 10 ? '0' + month : month;
					if (this.dateType === "year") {
						this.year = year;
					} else if (this.dateType === "month") {
						this.yearMonth = `${year}-${formattedMonth}`;
					}
				}
				this.leaderboard();
			},
			changeType(){
				this.selectDate = new Date();
				this.changeDate();
			},
			// 获取提醒天数
			getRemindDays(){
				orderApi.getReminderDays().then(res =>{
					if (res.code === 200){
						this.remindDays = res.data.court;
						this.remindShow = true;
					}
				})
			},
			// 输入检查
			inputCheck(e) {
				let inputNumber = this.remindDays
				if (inputNumber <= 0) {
					inputNumber = 1
				}
				// 只能输入整数
				let regex = /\./;
				if (regex.test(inputNumber)) {
					// 带小数设置为1
					inputNumber = 1
				}
				let value = parseInt(inputNumber)
				if (isNaN(value)) {
					value = 1;
				}
				this.remindDays = value
			},
			// 修改提醒天数
			updateReminderDays(){
				const data = {
					court: this.remindDays
				}
				orderApi.updateReminderDays(data).then(res =>{
					if (res.code === 200){
						this.$message.success("修改成功");
						this.remindShow = false;
					}
				})
			}
		},

	}
</script>

<style scoped>
	.orderList{
		height: 100%;
	}
	
	.order-table {
		height: 94%;
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		justify-content: center;
		margin-top: 10px;
	}

	.el-form--inline .el-form-item {
		width: 430px;
		margin-right: 40px;
	}
	
	.leaderboardLabel{
		display: inline-block;
		width: 165px;
	}
</style>